<template>
	<view class="leave leave-index">
		<textarea 
			class="text"
			name="text" 
			id="text" 
			cols="30" 
			rows="10" 
			:maxlength="300"
			v-model="text"
			placeholder="请输入您遇到的问题">
			<view class="num-count">
				{{nums}}/300
			</view>
		</textarea>
		<view class="submit">
			<view class="btn" @click="submit">
				提交反馈
			</view>
		</view>
	</view>
</template>

<script>
	import request from '../../../utils/request.js';
	import { GET_USER_INFO } from '../../../utils/CommonValues.js';
	export default {
		data() {
			return {
				text: '',
				nums: 0
			}
		},
		watch: {
			text(newValue) {
				this.nums = newValue.length;
			}
		},
		methods: {
			// 提交留言反馈
			submit() {
				GET_USER_INFO().then(response => {
					request.POST('/system/membersmsg/', {
						advMembersId: response.advMembersId,
						infomsg: this.text
					}).then(res => {
						if(res.code === 200) {
							this.text = '';
							uni.showToast({
								title: '留言成功',
								icon: 'none'
							})
						} else {
							uni.showToast({
								title: '留言失败',
								icon: 'none'
							})
						}
					})
				})
			}
		}
	}
</script>

<style lang="less">
.leave {
	width: 750rpx;
	height: 100vh;
	background-color: #eee;
	padding-top: 1px;
	box-sizing: border-box;
}
.text {
	position: relative;
	box-sizing: border-box;
	width: 700rpx;
	height: 300px;
	background-color: #fff;
	border-radius: 10px;
	margin: 10px auto;
	padding: 10px;
	padding-bottom: 20px;
	font-weight: bold;
	color: #999;
	.num-count {
		position: absolute;
		right: 0;
		bottom: 0;
		margin: 0 10px 0;
	}
}
.submit {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 750rpx;
	height: 100px;
	.btn {
		width: 700rpx;
		height: 40px;
		background-color: royalblue;
		margin: 0 auto;
		border-radius: 5px;
		text-align: center;
		line-height: 40px;
		color: #fff;
		&:active {
			background-color: steelblue;
		}
	}
}
</style>
